import React from 'react';
import {observer, inject} from 'mobx-react';
import * as mobx from 'mobx';
import SysFavouriteItem from './SysFavouriteItem';

@inject("sysFavouriteStore")
@observer
export default class SysFavouriteList extends React.Component {
    renderItems() {
        const {sysFavouriteStore} = this.props;

        const {data} = sysFavouriteStore;
        const list = mobx.toJS(data);

        return list.map((item) => {
            return (
                <SysFavouriteItem
                    ecId={`${this && this.props && this.props.ecId || ''}_SysFavouriteItem@e8lgl3@${item.favid}`}
                    key={item.favid}
                    {...item}
                />
            );
        });
    }

    componentDidUpdate() {
        this.executeLoadingMsg();
    }

    componentDidMount() {
        this.executeLoadingMsg();
    }

    executeLoadingMsg = () => {
        const {setLoaddingMsg} = this.props;
        setLoaddingMsg && typeof setLoaddingMsg == "function" && setLoaddingMsg();
    }

    render() {
        const items = this.renderItems();
        return (
            <div className="sysfav-list" ecId={`${this && this.props && this.props.ecId || ''}`}>
                {items}
            </div>
        );
    }
}
